p<template>
  <div class="admin">
    <el-table
      :data="memberList"
      row-key="id"
      :tree-props="{ children: 'children', hasChildren: 'hasChildren' }"
      style="width: 100%"
    >
      <el-table-column prop="id" label="编号" width="180"> </el-table-column>
      <el-table-column prop="nickname" label="昵称" width="180"> </el-table-column>
      <el-table-column prop="phone" label="手机号" width="180">
      </el-table-column>
      <el-table-column label="状态" width="180">
        <template #default="{ row: { status } }">
          <el-tag type="success" vla>正常</el-tag>
          <el-tag type="danger" v-show="status === 2">禁用</el-tag>
        </template>
      </el-table-column>
      <el-table-column label="操作">
        <template #default="{ row: { uid } }">
          <el-button
            type="primary"
            @click="$router.push({ path: '/setMember', query: { uid } })"
            size="mini"
            >编辑</el-button
          >
        </template>
      </el-table-column>
    </el-table>
  </div>
</template>
<script>
import { getMemberList} from "@/api/member.js";
export default {
  data() {
    return {
      memberList: [],
    };
  },
  async mounted() {
    this.getList();
  },
  methods: {
    //获取列表
    async getList() {
      let res = await getMemberList();
      this.memberList = res.list;
      console.log(res);
    },
  },
};
</script>
<style lang="less" scoped>
.admin {
  .el-pagination {
    text-align: right;
    margin: 10px;
  }
  .top {
    margin-bottom: 20px;
  }
}
.miaoshu {
  display: inline-block;
  padding: 5px;
  margin: 0 8px 0 0;
  background: skyblue;
  border-radius: 3px;
}
.img {
  width: 180px;
}
</style>


